var OrderForm = function () {
  var template = /* html */ `
    <div class="order-form" v-loading.fullscreen.lock="loading">
      <div class="order-form-btns">
        <el-button size="medium" type="primary" @click="ensure">保存</el-button>
      </div>
      <div class="order-form-table-div">
        <table cellspacing="0" cellpadding="0">
          <thead>
            <tr>
              <th style="min-width:140px">系统订单编号</th>
              <th style="min-width:140px">订单编号</th>
              <th style="min-width:120px">工厂型号</th>
              <th style="min-width:120px">客户型号</th>
              <th style="min-width:120px">客户订单号</th>
              <th style="min-width:100px">投料数</th>
              <th style="min-width:100px">订单总数</th>
              <th style="min-width:120px">部门</th>
              <th v-if="type==='add'" style="min-width:70px">操作</th>
            </tr>
          </thead>
          <tbody>
            <tr v-for="order in orderList" :key="'order_'+order.orderNo">
              <td>{{order.orderNo}}</td>
              <td>
                <el-input v-model="order.companyOrderNo" size="mini"></el-input>
              </td>
              <td>
                <el-input v-model="order.productNo" size="mini"></el-input>
              </td>
              <td>
                <el-input v-model="order.custVersionNo" size="mini"></el-input>
              </td>
              <td>
                <el-input v-model="order.custOrderNo" size="mini"></el-input>
              </td>
              <td>
                <el-input-number v-model="order.feedTotal" size="mini" :controls="false" :min="1" :precision="0"
                  style="width:100%"></el-input-number>
              </td>
              <td>
                <el-input-number v-model="order.orderTotal" size="mini" :controls="false" :min="0" :precision="0"
                  style="width:100%"></el-input-number>
              </td>
              <td>
                <el-select filterable v-model="order.deptId" size="mini" style="width:100%">
                  <template v-for="dept in deptList">
                    <el-option :key="dept.id" :value="dept.id" :label="dept.name" :disabled="dept.status===0"></el-option>
                  </template>
                </el-select>
              </td>
              <td v-if="type==='add'">
                <el-button size="mini" type="text" @click="delDevoceOrder(order)">删除</el-button>
              </td>
            </tr>
            <tr v-if="type==='add'">
              <td colspan="9">
                <el-button size="mini" type="text" @click="addDeviceOrder">
                  <span style="font-size:16px">+ 新增设备订单</span>
                </el-button>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  `;

  return {
    props: {
      orders: {
        type: Array,
        default: function () {
          return [];
        }
      },
      type: {
        type: String,
        default: 'add'
      },
      dropdownOption: {
        type: Object,
        default: function () {
          return {};
        }
      }
    },

    data: function () {
      return {
        loading: false,
        orderList: [],
        deptList: []
      };
    },

    created: function () {
      this.loading = true;
      var self = this;
      this.setDeptList().then(function () {
        self.loading = false;
        if (self.type === 'add') {
          self.addOrder();
        } else {
          self.orderList = self.getOrderList();
        }
      }).catch(function () {
        self.loading = false;
      });
    },

    methods: {
      setDeptList: function () {
        var dropdownOption = this.dropdownOption;
        var deptList = dropdownOption.deptList;
        if (deptList !== undefined) {
          deptList = this.formatDeptList(deptList);
          this.deptList = deptList;
          return Promise.resolve(deptList);
        }

        var self = this;
        return ajaxRequest('createOrder/selectOnlineByType', {
          type: 'order_p_deptid'
        }).then(function (deptList) {
          deptList = _.orderBy(deptList, ['status'], ['desc']);
          dropdownOption.deptList = deptList;
          deptList = self.formatDeptList(deptList);
          self.deptList = deptList;
          return deptList;
        });
      },

      formatDeptList:function(deptList){
        if (this.type === 'add') {
          deptList = _.filter(deptList, {
            status:1
          });
        }
        return deptList;
      },

      getOrderList: function () {
        var orders = this.orders;
        var orderList = _.map(orders, function (order) {
          order = new DeviceOrderModel(order);
          return order;
        });
        return orderList;
      },

      addDeviceOrder: function () {
        this.addOrder();
      },

      delDevoceOrder: function (order) {
        var orderList = this.orderList;
        var index = orderList.indexOf(order);
        orderList.splice(index, 1);
      },

      addOrder: function () {
        this.loading = true;
        var self = this;
        ajaxRequest('createOrder/getOrderInfoFixed').then(function (res) {
          var orderNo = res[0].result;
          var order = new DeviceOrderModel({
            orderNo: orderNo
          });

          self.orderList.push(order);
          self.loading = false;
        }).catch(function () {
          self.loading = false;
        });
      },

      ensure: function () {
        if (this.type === 'add') {
          this.toAddOrders();
        } else {
          this.toUpdateOrders();
        }
      },

      toAddOrders: function () {
        var orderList = this.orderList;
        if (orderList.length === 0) {
          this.$alert('没有订单可新增', '信息');
          return;
        }

        var orderPostData = [];
        for (var i = 0; i < orderList.length; i++) {
          var order = orderList[i];
          var code = order.checkValid();
          if (code !== '') {
            var msg = i18n.getMsg(`productOrderMgr.deviceOrder.error.${code}`);
            this.$alert(msg, '信息');
            return;
          }

          var postData = order.getObject();
          orderPostData.push(postData);
        }

        this.loading = true;
        var self = this;
        ajaxRequest('createOrder/insertOrderBatchForDevice', {
          orderdevicelist: JSON.stringify(orderPostData)
        }).then(function () {
          self.loading = false;

          self.$alert('设备订单新增成功', '信息', {
            callback: function () {
              self.$emit('savce-success');
            }
          });
        }).catch(function () {
          self.loading = false;
        });
      },

      toUpdateOrders: function () {
        var orderList = this.orderList;
        var orderPostData = [];
        for (var i = 0; i < orderList.length; i++) {
          var order = orderList[i];
          var code = order.checkValid();
          if (code !== '') {
            var msg = i18n.getMsg(`productOrderMgr.deviceOrder.error.${code}`);
            this.$alert(msg, '信息');
            return;
          }

          var postData = order.getObject();
          orderPostData.push(postData);
        }

        this.loading = true;
        var self = this;
        ajaxRequest('createOrder/updateOrderBatchForDevice', {
          orderdevicelist: JSON.stringify(orderPostData)
        }).then(function () {
          self.loading = false;

          self.$alert('设备订单修改成功', '信息', {
            callback: function () {
              self.$emit('savce-success');
            }
          });
        }).catch(function () {
          self.loading = false;
        });
      }
    },

    template: template
  };
}();
